<div class="main">
    <div class="wrapper clearfix">
        <div class="articles-wrapper fl">
            {% block main %}{% endblock %}
        </div>
        {% include 'common/sidebar.html' %}
    </div>
    <ul class="window-control">
        <li>回到顶部</li>
        <li>回到尾部</li>
    </ul>
</div>

<div class="banner-group" id="banner-group">
        <ul id="banner-ul" class="banner-ul clearfix">
            <li><a href="#"><img src="http://www.005.tv/uploads/191017/67-19101G0160XR.jpg"></a></li>
            <li><a href="#"><img src="http://www.005.tv/uploads/191015/67-191015111506403.jpg"></a></li>
            <li><a href="#"><img src="http://www.005.tv/uploads/191018/67-19101QI644547.jpg"></a></li>
            <li><a href="#"><img src="http://www.005.tv/uploads/191016/67-191016141615Y0.jpg"></a></li>
            <li><a href="#"><img src="http://www.005.tv/uploads/allimg/190626/63-1Z626115HUS.jpg"></a></li>
        </ul>
        <span class="prev-ctl">&lt;</span>
        <span class="next-ctl">&gt;</span>
        <div class="page-control-group">
            <ul class="page-control" id="page-control">

            </ul>
        </div>
    </div>
<div class="list-out-group">
        <ul class="list-tab">
            <li class="current"><a href="#">最新发布</a></li>
            <li><a href="#">热点话题</a></li>
            <li><a href="#">后端专题</a></li>
            <li><a href="#">前段专题</a></li>
        </ul>
        <ul class="list-inner-group">
            <li class="clearfix">
                <div class="thumbnail-group">
                    <a href="#"><img
                            src="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=2827671765,2134146140&fm=26&gp=0.jpg"></a>
                </div>
                <div class="article-group">
                    <p class="title"><a href="#">这是测试标题</a></p>
                    <p class="desc">这是描述信息</p>
                    <p class="more clearfix">
                        <span class="category fl">默认分类</span>
                        <span class="pub-time fr">2019/12/12</span>
                        <span class="author fr">linLinStyle</span>
                    </p>
                </div>
            </li>
            <li class="clearfix">
                <div class="thumbnail-group">
                    <a href="#"><img
                            src="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=2827671765,2134146140&fm=26&gp=0.jpg"></a>
                </div>
                <div class="article-group">
                    <p class="title"><a href="#">这是测试标题</a></p>
                    <p class="desc">这是描述信息</p>
                    <p class="more clearfix">
                        <span class="category fl">默认分类</span>
                        <span class="pub-time fr">2019/12/12</span>
                        <span class="author fr">linLinStyle</span>
                    </p>
                </div>
            </li>
        </ul>
        <div class="load-more-group">
            <button class="load-more-btn">加载更多</button>
        </div>
    </div>


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>模态对话框</title>
	<link rel="stylesheet" type="text/css" href="./../../dist/css/common/style.min.css">
	<link rel="stylesheet" type="text/css" href="./../../dist/css/auth/auth.min.css">
	<script type="text/javascript" src="./../../dist/js/jquery.min.js"></script>
	<script type="text/javascript" src="./../../dist/js/auth.min.js"></script>
</head>
<body>
	<button id="btn">点击登陆/注册</button>
	<div class="mask-wrapper">
		<div class="auth-wrapper">
			<div class="close-group">
				<i class="icon-cross close-btn"></i>
			</div>
			<div class="auth-inner-wrapper">
				<div class="scroll-wrapper">
					<div class="signin-group auth-group">
						<div class="top-group">
							<span class="title">请登录</span>
							<a class="switch" href="javascript: void(0);">立即注册></a>
						</div>
						<div class="form-group">
							<div class="input-group">
								<input placeholder="邮箱" class="form-control" name="email"></input>
							</div>
							<div class="input-group">
								<input placeholder="密码" class="form-control" name="password"></input>
							</div>
							<div class="input-group">
								<label>
									<input class="checked" type="checkbox" name="remember" value="1">
									记住我
								</label>
							</div>
							<div class="input-group">
								<input class="submit-btn" type="submit" value="立即登陆">
							</div>
						</div>
					</div>
					<div class="signup-group auth-group">
						<div class="top-group">
							<span class="title">请注册</span>
							<a class="switch" href="javascript: void(0);">立即登录<</a>
						</div>
						<div class="form-group">
							<div class="input-group">
								<input placeholder="邮箱" class="form-control" name="email"></input>
							</div>
							<div class="input-group">
								<div class="short-input-group">
									<input type="text" name="email-captcha" class="form-control" placeholder="邮箱验证码" />
								</div>
								<div class="input-group-addon">
									<span class="email-captcha-btn">发送验证码</span>
								</div>
							</div>
							<div class="input-group">
								<input placeholder="用户名" class="form-control" name="username"></input>
							</div>
							<div class="input-group">
								<input placeholder="密码" class="form-control" name="password"></input>
							</div>
							<div class="input-group">
								<input placeholder="重复密码" class="form-control" name="password-repeat"></input>
							</div>
							<div class="input-group">
								<div class="short-input-group">
									<input type="text" name="img-captcha" class="form-control" placeholder="图形验证码" />
								</div>
								<div class="input-group-addon">
									<a href="javascript: void(0);">
										<img class="image" src="">
									</a>
								</div>
							</div>
							<div class="input-group">
								<input class="submit-btn" type="submit" value="立即注册">
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>
</html>